<template>
	<view>
		<cu-page-bg></cu-page-bg>
		<view>
			<view class="index-content">
				<page-index-index :flowDataReload="flowDataReload" :reachBottomTemp="reachBottomTemp" v-if="tabbarValue == 0"></page-index-index>
				<page-index-flow :flowDataReload="flowDataReload" :reachBottomTemp="reachBottomTemp" :user-info="userInfo" v-if="tabbarValue == 1"></page-index-flow>
				<page-index-keep :user-info="userInfo" v-if="tabbarValue == 2"></page-index-keep>
				<page-index-person :user-info="userInfo" v-if="tabbarValue == 3"></page-index-person>
			</view>
			<cu-tabbar :value="tabbarValue" @change="name => tabbarValue = name" :fixed="true" :border="false"
				:placeholder="true" :safeAreaInsetBottom="true" :bg-show="true" :bg-background="tabbarBgBackground"
				inactiveColor="#FFF">
				<cu-tabbar-item text="首页" custom-prefix="iconfont" icon="icon-icon_shouye" size="48"></cu-tabbar-item>
				<cu-tabbar-item text="流水" custom-prefix="iconfont" icon="icon-liushuimingxi" size="48"></cu-tabbar-item>
				<cu-tabbar-item text="记一笔" icon="plus" :icon-hiden="true" size="48" :bg-show="true" :bg-background="tabbarItemBgBackground"></cu-tabbar-item>
				<cu-tabbar-item text="我的" custom-prefix="iconfont" icon="icon-wode" size="48"></cu-tabbar-item>
			</cu-tabbar>
		</view>
	</view>
</template>


<script>
	let vk = uni.vk;
	export default {
		data() {
			// 页面数据变量
			return {
				main: "#1cbbb4",
				secondary: "#8dc63f",
				tabbarValue: 0,
				tabbarItemBgBackground: {
					"background": "url(/static/jiyibi.gif) round",
					"active": "url(/static/jiyibi.gif) round",
					"top": "-110rpx"
				},
				// tabbarItemBgBackground:{"background":"orange","active":"blue"},
				// init请求返回的数据
				scrollTop: 0,
				userInfo: vk.getVuex("$user.userInfo"),
				bookId: "",
				allAccountBooks: vk.getVuex('$accountbook.allAccountBooks'),
				typeDataPickerData: vk.getVuex('$typeData.typeDataPickerData'),
				reachBottomTemp: 0,
				flowDataReload: 0,
			}
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		// 监听 - 页面每次【加载时】执行(如：前进)
		onLoad(options = {}) {
			vk = uni.vk;
			this.options = options;
			this.init(options);
		},
		// 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快，会在页面进入动画完成前触发
		onReady() {

		},
		onReachBottom() {
			this.reachBottomTemp = Date.now()
		},
		// 监听 - 页面每次【显示时】执行(如：前进和返回) (页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面)
		async onShow() {
			this.main = vk.getVuex('$app.color.main')
			this.secondary = vk.getVuex('$app.color.secondary')
			await this.shareBookAdd();
			if (vk.myfn.isNotEmpty(this.userInfo)) {
				if (vk.myfn.isEmpty(this.allAccountBooks)) {
					await this.enqrAllAccountBook()
					this.flowDataReload = Date.now()
				}
				if (vk.myfn.isEmpty(this.typeDataPickerData)) {
					await this.enqrAllTypDatFun()
					this.flowDataReload = Date.now()
				}
			}
		},
		// 监听 - 页面每次【隐藏时】执行(如：返回)
		onHide() {

		},
		// 监听 - 点击右上角转发时
		onShareAppMessage(options) {

		},
		// 函数
		methods: {
			// 页面数据初始化函数
			init(options) {
				// vk.reLaunch("/pages_template/uni-id/index/index");
				this.main = vk.getVuex('$app.color.main')
				this.secondary = vk.getVuex('$app.color.secondary')
				if (options != null && options.bookId) {
					this.bookId = options.bookId
				}
				if (options != null && options._id) {
					this._id = options._id
				}
				
			},
			pageTo(path) {
				vk.navigateTo(path);
			},
			tabbarItemChick() {
				if (this.tabbarValue == 2) {
					this.vk.myfn.gotoPage('/pages/accounting/record/add', 'navigate')
				}
			},
			async shareBookAdd() {
				if (vk.myfn.isNotEmpty(this.bookId) && vk.myfn.isEmpty(this.userInfo)) {
					this.vk.myfn.gotoPage('/pages/oauth/login/index', 'navigate')
				} else if (vk.myfn.isNotEmpty(this.bookId) && vk.myfn.isNotEmpty(this.userInfo)) {
					const bookId = this.bookId
					this.bookId = undefined;
					let that = this
					await vk.callFunction({
						url: 'client/accountbook/kh/addUserRelationBook',
						title: '请求中...',
						data: {
							need_user_info: true, // 注意，need_user_info是加在 data 的属性里，而不是与data同级
							bookId: bookId
						},
						success: async (res) => {
							vk.toast("加入成功", "success");
							vk.reLaunch("/pages/index/index");
						},
						fail: (err) => {
							const msg = "加入失败-" + err.msg
							vk.alert(msg, "错误提示");
						}
					});
				}
			},
			async enqrAllAccountBook() {
				let that = this
				const pagination = {
					"pageIndex": 1,
					"pageSize": 1000
				}
				await vk.callFunction({
					url: 'client/accountbook/kh/enqrAccountBook',
					title: '请求中...',
					data: {
						need_user_info: true, // 注意，need_user_info是加在 data 的属性里，而不是与data同级
						pagination: pagination
					},
					success: async (res) => {
						await that.$store.dispatch('$accountbook/enqrAccountBook', {
							res
						});
						that.allAccountBooks= vk.getVuex('$accountbook.allAccountBooks');
					},
					fail: (err) => {
						const msg = "查询账本失败-" + err.msg
						vk.alert(msg, "错误提示");
					}
				});
			},
			async enqrAllTypDatFun() {
				let that = this
				const pagination = {
					"pageIndex": vk.getVuex('$typeData.enqrDataByPage.pagination.pageIndex') + 1,
					"pageSize": vk.getVuex('$typeData.enqrDataByPage.pagination.pageSize')
				}
				await vk.callFunction({
					url: 'client/typeData/kh/getTypeDataList',
					title: '请求中...',
					data: {
						need_user_info: true, // 注意，need_user_info是加在 data 的属性里，而不是与data同级
						pagination: pagination
					},
					success: async (res) => {
						await that.$store.dispatch('$typeData/enqrDataByPage', {res});
						that.typeDataPickerData= vk.getVuex('$typeData.typeDataPickerData') || []
					},
					fail: (err) => {
						const msg = "查询失败-" + err.msg
						vk.alert(msg, "错误提示");
					}
				});
			},
			async onRefresh(){
				if(this.tabbarValue === 1 || this.tabbarValue === 0){
					await this.enqrAllAccountBook()
					this.flowDataReload = Date.now()
				}
			},
		},
		// 监听器
		watch: {

		},
		// 计算属性
		computed: {
			tabbarBgBackground() {
				let bg = "linear-gradient(45deg, " + this.main + ", " + this.secondary + ")";
				console.log(bg)
				return {
					"background": bg
				}
			}
		}
	}
</script>
<style lang="scss" scoped>


</style>